<template>
  <div class="app-container">
         <el-table v-loading="loading" :data="list" >
            <el-table-column fixed label="合同编号" align="center" prop="code" />
            <el-table-column label="合同名称" align="center" prop="name" >
                <template slot-scope="scope">
                  <el-link @click="openContract(scope.row)" :underline="false" type="primary" >{{scope.row.name}}</el-link>
                </template>
            </el-table-column>
            <el-table-column label="合同金额" align="center" prop="money" width="120px">
                <template slot-scope="scope">
                  <span class="money">{{formatMoney(scope.row.money,',')}}</span>
                </template>
            </el-table-column>
            <el-table-column label="客户名称" align="center" prop="customerName" >
              <template slot-scope="scope">
                  <el-link @click="openCustomer(scope.row)" :underline="false" type="primary" >{{scope.row.customerName}}</el-link>
                </template>
            </el-table-column>
            <el-table-column label="下单时间" align="center" prop="orderDate" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="合同开始时间" align="center" prop="startTime" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="合同结束时间" align="center" prop="limitTime" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="客户签约人" align="center" prop="customerName" />
            <el-table-column label="备注" align="center" prop="remark" />
            <el-table-column label="负责人" align="center" prop="nickName" />
              <el-table-column label="状态" align="center" prop="checkStatus" >
                <template slot-scope="scope">
                      <el-tag prop="checkStatus" v-for="(item, index) in statusOptions"  :type="scope.row.checkStatus==1?'success':'danger'"  v-if="scope.row.checkStatus==item.dictValue">{{item.dictLabel}}</el-tag>
                  </template>
              </el-table-column>
              <el-table-column label="审核人" align="center" prop="customerName" />
              <el-table-column label="审核时间" align="center" prop="auditTime" width="180">
                <template slot-scope="scope">
                  <span>{{ parseTime(scope.row.auditTime, '{y}-{m}-{d}') }}</span>
                </template>
              </el-table-column>
              <el-table-column label="审核意见" align="center" prop="auditNote" />
          </el-table>
            <pagination
              v-show="total>0"
              :total="total"
              :page.sync="queryParams.pageNum"
              :limit.sync="queryParams.pageSize"
              @pagination="getList"
            />
    
  </div>
</template>

<script>

import { getNewContract } from "@/api/crm/contract";

export default {
  name: "customer",
  data() {
    return {
      statusOptions:[],
      contractTypeOptions:[],
      // 遮罩层
      loading: true,
      list: [],
      total: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },

    };
  },
  created() {
   this.getDicts("contract_status").then((response) => {
      this.statusOptions = response.data;
    });
     this.getDicts("contract_type").then((response) => {
      this.contractTypeOptions = response.data;
    });
   
  },
  mounted() {
   
  },
  methods: {
    openContract(row){
      const contractId = row.contractId || this.ids
      this.$emit('open-contract',contractId);
    },
    openCustomer(row){
      const customerId = row.customerId || this.ids
      this.$emit('open-customer',customerId);
      
    },
    getList(data) {
      this.loading = true;
      this.queryParams.type=data.type;
      this.queryParams.userIds=data.userIds;
      this.queryParams.deptId=data.deptId;
      getNewContract(this.queryParams).then(response => {
        this.list = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    
   
    
  }
};
</script>
<style scoped>
 
</style>

